<%- include('../template/layout.html') %>
<body>
    <h2>我是首页</h2>
    <p>
      Date.now(): <%= Date.now() %>
    </p>
    <%- include('../module/play/play.ejs') %>
    <div class="demo">
      <img src="../../images/flickr/flickr.jpg" alt="">
    </div>
    <input type="button" value="开启桌面通知" id="btn">
    <script>

      var btn = document.getElementById('btn')
        btn.onclick = function () {
          console.log(555)
          notifyMe()
        }
        function notifyMe() {

          console.log(Notification.permission)

          // 首先检查浏览器是否支持
          if (!('Notification' in window)) {
            alert('浏览器不支持桌面提醒')
          }
          //检查是否允许Notification
          else if (Notification.permission === 'granted') {
            console.log(1111)
            newInfo()
          }
          //如果没有拒绝Notification，就申请用户允许
          else if (Notification.permission !== 'denied') {
            console.log(2222)
            //回调模式
            Notification.requestPermission(function (permission) {
              if (permission === 'granted') {
                newInfo()
              }
            })
            // Notification.requestPermission().then(//promise
            //     newInfo()
            // )
          }
        }
        function newInfo(title, options) {
          console.log(2323)
          title = title || '新的消息'
          options = options || {
            body: '默认消息',
            icon: ''
          }
          return new Notification(title, options)
        }

        

        
    </script>


    <script>
      const NotificationInstance = Notification || window.Notification;

        if (!!NotificationInstance) {
          const permissionNow = NotificationInstance.permission;
          if (permissionNow === 'granted') {//允许通知
            CreatNotification();
          } else if (permissionNow === 'denied') {
            alert('亲，欢迎你下次再来!!!');
          } else {
            setPermission();
          }
          function setPermission() {
            //请求获取通知权限
            NotificationInstance.requestPermission(function (PERMISSION) {
              if (PERMISSION === 'granted') {
                CreatNotification();
              } else {
                console.log('用户无情残忍的拒绝了你!!!');
              }
            });
          }
          function CreatNotification() {
            const n = new NotificationInstance('点餐系统发来消息', {
              body: '老板，请点餐了。',
              tag: '2ue',
              icon: '//3img.hitv.com/preview/internettv/sp_images/ott/2018/11/12/zongyi/326658/20181112155420068-new.jpg_220x308.jpg',
              data: {
                url: 'http://10.200.8.20/dinner/?action=index'
              }
            });


            n.onshow = function () {
              console.log('通知显示了！');
            }

            n.onclick = function (e) {
              //可以直接通过实例的方式获取data内自定义的数据
              //也可以通过访问回调参数e来获取data的数据
              window.open(n.data.url, '_blank');
              n.close();
            }

            n.onclose = function () {
              console.log('你墙壁了我！！！');
            }
            
            n.onerror = function (err) {
              console.log('出错了，小伙子在检查一下吧');
              throw err;
            }
            // setTimeout(() => {
            //   n.close();
            // }, 2000);
          }
        }
    </script>

    <%- include('../template/statistics.ejs') %>
  </body>
</html>